<?php

/**
 * @file
 * Custom theme implementation to display a single Drupal page.
 */

?>

<!-- Navbar -->
<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title></title>
  <!-- endbuild -->
</head>
<style>
  header.chat-view__header {
    background: url("<?php echo drupal_get_path('module', 'contact');?>img/chat-title.png") 10px 2px;
    background-repeat: no-repeat;
    background-color: #538fdb;
    height: 52px;
  }
  .window {
    width: 540px !important;
  }
  .chat-view {
    left: 0 !important;
  }
</style>
<input id="consultType" type="hidden" value="<?php print @$_GET['type']?>">
<input id="farmer" type="hidden" value="true">

<body ng-app="onlineChat">
<div class="window" ng-controller="MainCtrl">
  <div class="chat-view">
    <header class="chat-view__header">
      <div class="cf">
        <div class="status">
          <div class="meta">
            <!--div class="meta__name">{{chatDetailName}}</div-->
          </div>
        </div>
      </div>
    </header>
    <div class="right" id="message-list">
      <div class="message-view" message-data detail-messages="chatDetailMessages" detail-users="chatDetailUsers" self-id="{{uid}}" scroll="scrollTopOrBottom" switch-chat="switchChat">
        <div id="mainMessages"></div>
      </div>
    </div>

    <footer class="chat-view__input">
      <div>
        <textarea id="editArea" class="messageToSend" rows="10" cols="10" placeholder="Ctrl+Enter发送"></textarea>
      </div>
      <div class="action">
        <div id="sendDiv">
          <input id="sendButton" type="button" class="btn_send" value="发送" ng-click="sendMessageOrFile()"/>
        </div>
        <div id="fileDiv">
          <label id="fileUploadButton">
            <input id="file" type="file"/>
          </label>
        </div>
        <div id="progressbar">
          <div class="outbar">
            <div class="inbar-filename"></div>
            <div class="inbar" style="width:{{percentage}}%;">
            </div>
          </div>
        </div>
      </div>
    </footer>
  </div>

</div>


<script>
  jQuery(document).ready(function(){
    jQuery("#file").change(function(e) {
      window.file = e.target.files[0];
      jQuery(".inbar-filename").html(window.file.name);
      jQuery('#progressbar').show();
      jQuery('.window').scope().$apply(function(scope){
        scope.percentage = 0;
      });
    });
    jQuery('#editArea').keydown(function(e) {
      if (e.ctrlKey && e.keyCode == 13 && !jQuery('#sendButton').attr("disabled")) {
        jQuery('#sendButton').trigger('click');
      }
    });
    jQuery('p').live('click',function(){
      jQuery(this).next().slideToggle("fast");
    });
    jQuery('#progressbar').hide();
  });
</script>

</body>
</html>
